<template>
	<view class="flex f-container">
		<view class="item">
			<view class="image-container">
				<image src="@/static/images/f.png" mode="widthFix" class="image"></image>
			</view>
			<view class="title">
				拼团
			</view>
		</view>
		<view class="item">
			<view class="image-container">
				<image src="@/static/images/f.png" mode="widthFix" class="image"></image>
			</view>
			<view class="title">
				嗨购
			</view>
		</view>
		<view class="item">
			<view class="image-container">
				<image src="@/static/images/f.png" mode="widthFix" class="image"></image>
			</view>
			<view class="title">
				预售
			</view>
		</view>
		<view class="item">
			<view class="image-container">
				<image src="@/static/images/f.png" mode="widthFix" class="image"></image>
			</view>
			<view class="title">
				水果
			</view>
		</view>
		<view class="item">
			<view class="image-container">
				<image src="@/static/images/f.png" mode="widthFix" class="image"></image>
			</view>
			<view class="title">
				其它
			</view>
		</view>
	</view>
</template>

<script>
export default{
	data(){
		return{
			
		}
	},
	methods:{
		
	}
}
</script>

<style lang="scss" scoped>
.image{
	height: 100%;
	width: 100%;
}
.flex{
	display: flex;
}


.f-container{
	background-color: white;
	padding: 18rpx 0;
	margin: 16rpx 0;
	.item{
		text-align: center;
		width: 20%;
		color: #444;
		.title{
			margin-top: 4rpx;
		}
		font-size: 26rpx;
		.image-container{
			width: 80rpx;
			margin: auto;
		}
	}
}
</style>